<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
</head>
<style>
    *{
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .Top1{
    display: flex;
   
    height: 60px;
 
   justify-content: space-between;
   align-items: center;
   
   }
   .p-3 li{
    display: flex;
    justify-content: space-around;
   width: 320px;
   }
   span{
    flex: 1;
   }
   button{
    width: 80px;
    border: none;
    border: 1px solid gray;
    height: 40px;
    border-radius: 5px;
   }
h4{
    color: red;
}
.p-3{
    width: 100%;
    display: flex;
   
}
.p-3 ul{
    width: 300px;
}
.p-3 ul li{
    line-height: 50px;
    /* width: 300px; */
}
select{
    height: 30px;
}



.p-3 ul li span:nth-child(2){
    display: block;
    width: 50px;
}
</style>
<body>
    


<div class="container">
    <h4>用户详情页面:</h4>
    <div class="Top1">
        <nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
            <ol class="breadcrumb">
              <li class="breadcrumb-item">首页</li>
              <li class="breadcrumb-item" aria-current="page">信息管理</li>
              <li class="breadcrumb-item active" aria-current="page">用户管理</li>
            </ol>
          </nav>
        <button> <a href="/index/userejs">返回</a></button>
    </div>



    <div class="container overflow-hidden text-center">
        <div class="row gx-5">
          <div class="col">
           <div class="p-3 border bg-light">
            <ul>
                <li><span>用户&nbsp;&nbsp;&nbsp;ID:</span><span><%=dataSouse.uid%></span></li>
                <li><span>注册时间</span><span><%=dataSouse.ulogindata%></span></li>
                <li><span>证件类型</span><span><%=dataSouse.uIDType%></span></li>
                <li><span>认证时间</span><span><%=dataSouse.ulogindata%></span></li>
                <li><span>所在地区</span><span><%=dataSouse.uaddress%></span></li>
                <form action="/index/" method="post">
                    <li><span>账号状态</span>
                        <span><select name="zt" id="">
                            <option value="<%=dataSouse.is_state%>"><%=dataSouse.is_state%></option>
                            <option value="有效">有效</option>
                            <option value="冻结">冻结</option>
                        </select></span>
                </li>
                    <li><button type="submit" class="btn btn-info">保存</button></li>
                </form>
            </ul>
            <ul>
                <li><span>注册手机号</span><span><%=dataSouse.uphome%></span></li>
                <li><span>真实姓名</span><span><%=dataSouse.uname%></span></li>
                <li><span>证件号码</span><span><%=dataSouse.UID%></span></li>
                <li><span>人脸识别</span><span><%=dataSouse.is_face%></span></li>
                <li><span>详细地址</span><span><%=dataSouse.uaddressxx%></span></li>
               
            </ul>
           </div>
          </div>
         
        </div>
      </div>
      <h5>已绑定的家属:</h5>
      <div class="container">
        <table class="table">
            <thead>
              <tr class="table-secondary text-center">
                <th scope="col">家人ID</th>
                <th scope="col">姓名</th>
                <th scope="col">证件类型</th>
                <th scope="col">证件号码</th>
                <th scope="col">手机号</th>
                <th scope="col">性别</th>
                <th scope="col">所在地区</th>
                <th scope="col">详细地址</th>
                <th scope="col">家人关系</th>
                <th scope="col">状态</th>
    
              </tr>
            </thead>
            <tbody>
            

<%newdat.forEach((value,index)=>{%>
    <tr class="text-center">
      <th scope="row"><%=value.pid%></th>
     
      <td><%=value.uname%></td>
      <td><%=value.uIDType%></td>
      <td><%=value.pUID%></td>
      <td><%=value.pphome%></td>

      <td><%=value.psex%></td>
      <td><%=value.uaddress%></td>
      <td><%=value.uaddressxx%></td>
      <td><%=value.relation%></td>
      <td><%=value.is_state%></td>
      
      
    </tr>
    <% })%>
    
    
            </tbody>
          </table>

      </div>


</div>





    
</body>
</html>